<template>
  <!-- 用法 -->
  <!-- 引入 -->
  <!-- import Select from '@/components/select/select' -->
  <!-- components: {
    Select
  }-->
  <!-- <Select :select.sync="value" label='type'></Select> -->
  <!-- value：双向绑定的数据value label：请求数据的类型 -->
  <div class="select">
    <el-form>
      <el-form-item :label="label">
        <el-select v-model="selectedVal" placeholder="请选择">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.name"
            :value="item.value"
          ></el-option>
        </el-select>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedVal: this.select,
      options: []
    };
  },
  props: {
    label: {
      type: String,
      default: ""
    },
    select: {
      type: String,
      required: true
    }
    // types: {
    //   type: String,
    //   default: ""
    // }
  },
  mounted() {
    this.init();
  },
  methods: {
    init() {
      this.$http({
        url: this.$http.adornUrl(`/sys/dict/type/${this.label}`),
        method: "get"
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.options = data.dictList;
        } else {
          this.$message.error(data.msg);
        }
      });
    }
  },
  watch: {
    selectedVal: function(val, oldVal) {
      if (val !== oldVal) {
        this.$emit("update:select", val);
      }
    }
  }
};
</script>

<style>
</style>